<!-- OrderDetail.vue -->
<template>
    <div>OrderDetail
      <h2>订单详情</h2>
      <el-table :data="detailData" border style="width: 100%">
        <!-- 根据需要添加列 -->
        <el-table-column prop="pid" label="商品编号">
          <template #default="scope">
        A00{{ scope.row.pid }}
      </template>
        </el-table-column>
        <el-table-column prop="oid" label="订单编号">
          <template #default="scope">
        A00{{ scope.row.oid }}
      </template>
        </el-table-column>
        <el-table-column prop="num" label="数量"></el-table-column>
        <!-- 更多列... -->
      </el-table>
    </div>
  </template>
  
  <script>
  import {getOrderDetail} from "@/api/order";
  export default {
    data() {
      return {
        detailData: [], // 详情页面的数据
      };
    },
    created() {
      // 在created生命周期钩子中获取详情数据
      this.fetchDetailData();
    },
    methods: {
      fetchDetailData() {
    
        const oid = this.$route.params.oid;

        getOrderDetail(oid).then(response => {
        this.detailData = response.data;
      });
 
      },
    },
  };
  </script>